{% extends "front/base.html" %}

{% block content %}
<!-- 页面标题 -->
<section class="page-header bg-light py-5">
    <div class="container">
        <h1 class="text-center mb-0">{{ '最新資訊' | t }}</h1>
    </div>
</section>

<!-- 新闻列表 -->
<section class="news-section section-padding">
    <div class="container">
        <!-- 新闻分类标签 -->
        <div class="news-categories text-center mb-5">
            <div class="btn-group" role="group">
                <button type="button" class="btn btn-outline-primary active">{{ '全部' | t }}</button>
                <button type="button" class="btn btn-outline-primary">{{ '公司動態' | t }}</button>
                <button type="button" class="btn btn-outline-primary">{{ '行業資訊' | t }}</button>
                <button type="button" class="btn btn-outline-primary">{{ '技術分享' | t }}</button>
            </div>
        </div>

        <!-- 新闻卡片列表 -->
        <div class="row g-4">
            <!-- 新闻项目1 -->
            <div class="col-md-6 col-lg-4">
                <div class="news-card">
                    <img src="{{ url_for('static', filename='images/news/news1.jpg') }}" class="card-img-top" alt="新闻图片">
                    <div class="card-body">
                        <div class="news-meta mb-2">
                            <span class="category">{{ '公司動態' | t }}</span>
                            <span class="date">2024-02-14</span>
                        </div>
                        <h5 class="card-title">{{ '日創科技榮獲2024年香港創新企業獎' | t }}</h5>
                        <p class="card-text">{{ '我司憑藉在人工智能領域的創新成果，榮獲2024年香港創新企業獎，這標誌著我們在技術創新方面的實力得到了業界認可。' | t }}</p>
                        <a href="#" class="btn btn-link px-0">{{ '閱讀更多' | t }} →</a>
                    </div>
                </div>
            </div>

            <!-- 新闻项目2 -->
            <div class="col-md-6 col-lg-4">
                <div class="news-card">
                    <img src="{{ url_for('static', filename='images/news/news2.jpg') }}" class="card-img-top" alt="新闻图片">
                    <div class="card-body">
                        <div class="news-meta mb-2">
                            <span class="category">{{ '技術分享' | t }}</span>
                            <span class="date">2024-02-10</span>
                        </div>
                        <h5 class="card-title">{{ '人工智能在中小企業中的應用前景' | t }}</h5>
                        <p class="card-text">{{ '隨著AI技術的不斷發展，越來越多的中小企業開始關注如何運用AI技術提升運營效率，我們將分享一些實用的應用案例。' | t }}</p>
                        <a href="#" class="btn btn-link px-0">{{ '閱讀更多' | t }} →</a>
                    </div>
                </div>
            </div>

            <!-- 新闻项目3 -->
            <div class="col-md-6 col-lg-4">
                <div class="news-card">
                    <img src="{{ url_for('static', filename='images/news/news3.jpg') }}" class="card-img-top" alt="新闻图片">
                    <div class="card-body">
                        <div class="news-meta mb-2">
                            <span class="category">{{ '行業資訊' | t }}</span>
                            <span class="date">2024-02-05</span>
                        </div>
                        <h5 class="card-title">{{ '香港政府推出新一輪科技券計劃' | t }}</h5>
                        <p class="card-text">{{ '香港特區政府宣布推出新一輪科技券計劃，支持中小企業採用科技方案，提升競爭力。' | t }}</p>
                        <a href="#" class="btn btn-link px-0">{{ '閱讀更多' | t }} →</a>
                    </div>
                </div>
            </div>

            <!-- 更多新闻项目... -->
        </div>

        <!-- 分页 -->
        <nav class="mt-5">
            <ul class="pagination justify-content-center">
                <li class="page-item disabled">
                    <a class="page-link" href="#" tabindex="-1">{{ '上一頁' | t }}</a>
                </li>
                <li class="page-item active"><a class="page-link" href="#">1</a></li>
                <li class="page-item"><a class="page-link" href="#">2</a></li>
                <li class="page-item"><a class="page-link" href="#">3</a></li>
                <li class="page-item">
                    <a class="page-link" href="#">{{ '下一頁' | t }}</a>
                </li>
            </ul>
        </nav>
    </div>
</section>
{% endblock %} 